import type { Component } from 'vue';
import type { AnyFunction } from '@vben/types';
import { computed, ref } from 'vue';
import { useRouter } from 'vue-router';
import { useAccessStore, useUserStore } from '@vben/stores';
import { useAuthStore } from '#/store';
import { CircleUserRound, Settings, UserRound } from '@vben/icons';
import userIcon from '#/assets/images/user-img.png';
import { DEFAULT_HOME_PATH } from '#/utils/constants';

interface UserDropdownConfig {
  /** 是否显示管理端菜单 */
  showAdminMenu?: boolean;
  /** 是否显示个人中心菜单 */
  showPersonalCenter?: boolean;
  /** 是否显示用户端菜单 */
  showUserMenu?: boolean;
  /** 自定义头像，如果不传则使用动态头像 */
  customAvatar?: string;
  /** 额外的菜单项 */
  extraMenus?: Array<{ handler: AnyFunction; icon?: Component; text: string }>;
}

export function useUserDropdown(config: UserDropdownConfig = {}) {
  const {
    showAdminMenu = false,
    showPersonalCenter = false,
    showUserMenu = false,
    customAvatar,
    extraMenus = []
  } = config;

  const router = useRouter();
  const userStore = useUserStore();
  const accessStore = useAccessStore();
  const authStore = useAuthStore();
  // 登录状态
  const isLogin = computed(() => !!accessStore.accessToken);

  // 用户头像
  const avatar = computed(() => {
    if (customAvatar) return customAvatar;
    return userStore.userInfo?.icon || userIcon;
  });

  // 用户名
  const userName = computed(() => {
    return isLogin.value ? userStore.userInfo?.phone : '游客';
  });

  // 用户描述（邮箱）
  const description = computed(() => {
    return userStore.userInfo?.email || '';
  });

  // 模态框消息
  const modalMsg = computed(() => {
    return userStore.userInfo?.phone ? '' : '是否去登录?';
  });

  // 菜单项
  const menus = computed(() => {
    const menuList: Array<{ handler: AnyFunction; icon?: Component; text: string }> = [];

    // 用户端菜单
    if (showUserMenu) {
      menuList.push({
        handler: () => router.push({
          path: DEFAULT_HOME_PATH
        }),
        icon: UserRound,
        text: '用户端'
      });
    }

    // 个人中心菜单
    if (showPersonalCenter && isLogin.value) {
      menuList.push({
        handler: () => router.push('/lesson/personalCenter'),
        icon: CircleUserRound,
        text: '个人中心'
      });
    }

    // 管理端菜单（需要管理员权限）
    if (showAdminMenu && isLogin.value && userStore.userInfo?.isAdmin) {
      menuList.push({
        handler: () => router.push(userStore.userInfo?.adminHomePath || '/exam/questionBank'),
        icon: Settings,
        text: '管理端'
      });
    }

    // 添加额外菜单
    menuList.push(...extraMenus);

    return menuList;
  });

  // 退出登录
  const handleLogout = async () => {
    await authStore.logout(false);
  };

  // UserDropdown组件的属性对象
  const userDropdownProps = computed(() => ({
    avatar: avatar.value,
    isLogin: isLogin.value,
    text: userName.value,
    description: description.value,
    modalMsg: modalMsg.value,
    menus: menus.value
  }));

  return {
    // 计算属性
    isLogin,
    avatar,
    userName,
    description,
    modalMsg,
    menus,

    // 方法
    handleLogout,

    // 组件属性对象（用于v-bind）
    userDropdownProps
  };
}
